<template>
      <div id="quesList">
            <el-card>
                  <div slot="header">
                        <span>问卷列表</span>
                        <el-button style="float: right;" size="mini" type="primary" icon="el-icon-plus" @click="$router.push({name:'papersAdd'})">添加问卷</el-button>
                  </div>
                  <!-- 展示问卷主体 -->
                  <el-table :data="papersList" v-loading="treeLoading" stripe>
                        <el-table-column label="日期">
                              <span slot-scope="{row}">
                                    {{$moment(row.ctime).add(8,'hours').format("YYYY-MM-DD HH:mm:ss")}}
                              </span>
                        </el-table-column>
                        <el-table-column prop="title" label="标题"></el-table-column>
                        <el-table-column prop="username" label="创建人" align="center"></el-table-column>
                        <el-table-column prop="classname" label="班级" align="center"></el-table-column>
                        <el-table-column label="操作" align="center">
                              <div slot-scope="{row}">
                                    <!-- 下拉列表操作部分 begin -->
                                    <el-dropdown @command="select">
                                          <span class="el-icon-more" style="transform:rotate(90deg);cursor:pointer"></span>
                                          <el-dropdown-menu slot="dropdown">
                                                <el-dropdown-item :command="{type:'delete',id:row.id}">
                                                      <i class="el-icon-delete"></i>
                                                      删除</el-dropdown-item>
                                                <el-dropdown-item :command="{type:'link',data:{name:'papersEdit',params:{id:row.id}}}">
                                                      <i class="el-icon-edit"></i>
                                                      编辑
                                                      </el-dropdown-item>
                                                <el-dropdown-item :command="{type:'link',data:{name:'publish',params:{paper_id:row.id}}}">
                                                      <i class="el-icon-share"></i>
                                                      发布</el-dropdown-item>
                                                <el-dropdown-item :command="{type:'link',data:{name:'count',params:{paper_id:row.id}}}">
                                                      <i class="el-icon-document"></i>
                                                      分析
                                                      </el-dropdown-item>
                                          </el-dropdown-menu>
                                    </el-dropdown>
                                    <!-- 下拉列表操作部分 end -->
                                    
                              </div>
                        </el-table-column>
                  </el-table>
                  <!-- 分页 -->
                  <el-pagination style="margin-top:30px" :page-size="pagesize" :page-sizes="[1,2,5,10,15]" @size-change="onchange"  @current-change="getQuesList" :current-page.sync="currentPage" layout=" prev, pager, next,sizes,total" :total="total"></el-pagination>
            </el-card>
      </div>
</template>
<script>

export default {
     
      data(){
            return {
                  papersList:[],
                  pagesize:5,
                  currentPage:1,
                  total:0,
            }
      },
      methods:{
            // 问卷列表请求方法
            getQuesList(){
                  this.treeLoading=true
                  this.$http.get(`/papers/list?pagesize=${this.pagesize}&currentpage=${this.currentPage}`).then(result=>{
                        // console.log(result)
                        if (result.data.error > 0 &&result.data.error==4) {
                              this.$router.push('/users/login')
                              return
                        }
                        this.treeLoading=false
                        this.papersList = result.data.data;
                        this.total=result.data.total
                  }).catch(error=>{
                        console.log(error)
                  })
            },
            //   pagesize改变时的方法
            onchange(val){
                  this.pagesize=val
                  this.getQuesList()
            },
            // 删除问卷的方法
            papersDel(id){
                  this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                  }).then(() => {
                        this.$http.get(`/papers/delete?id=${id}`).then(result=>{
                              if(result.data.error==0){
                                    this.getQuesList()
                                    this.$message({
                                    type: 'success',
                                    message: '删除成功!'}) 
                              }else{
                                    this.$message({
                                    type: 'danger',
                                    message: '删除失败!'})
                              }
                        });
                  }).catch(error=>{
                        console.log(error)
                  })    
            },
            // 问卷删除
            select(obj){
                  switch(obj.type){
                        case 'delete':
                              //调用删除问卷方法
                              this.papersDel(obj.id)
                        break;
                        case 'link':
                              this.$router.push(obj.data);
                        break;
                default:;
          }
    },
      },
      created(){
            // 调用获取问卷方法
            this.getQuesList()
      }
}
</script>
<style>

</style>


